<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>注册 - 爽客网</title>
<%@include file="v1/common/js.jsp" %>
<%@include file="v1/common/jspcommon.jsp" %>
<%@include file="v1/common/css.jsp" %>
<link href="css/other.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">

$.validator.addMethod("stringCheck", function(value, element) { 
	   return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);       
	}, "只能包括中文字、英文字母、数字和下划线");  

	$(document).ready(function() {
		initProvince('province', 'city');
		// 表单验证使用属性validate进行验证
		$.metadata.setType("attr", "validate");
		$("#vCode").val('');
		$("#yzm_src").attr("src","verifyCode.htm?time="+(new Date()).getTime());
		$("#registerForm").validate(
				{
					errorClass:"register_error",
					success : function(label) {
						label.addClass("register_success").text("");
					},
					rules : {
						nickname : {
							required : true,
							maxlength : 16,
							minlength : 4,
							remote : 'checkNickname.htm',
							stringCheck:true
						},
						email : {
							required : true,
							email : true,
							remote : 'checkEmail.htm',
							maxlength : 50
						},
						password : {
							required : true,
							minlength : 6,
							maxlength : 20
						},
						checkPwd:{
							required : true,
							equalTo:'#password'
						},
						cardNum : {
							minlength : 4,
							remote : 'checkCardNum.htm'
						}
						
					},
					messages : {
						nickname : {
							required : "请填写你的用户名",
							minlength : "用户名必须为4～16个字符",
							maxlength : "用户名必须为4～16个字符",
							remote : "该用户名已被注册",
							stringCheck: "用户名只能包括中文字、英文字母、数字和下划线"
						},
						email : {
							required : "请填写邮箱",
							email : "请填写正确的邮箱地址",
							remote : "该邮箱已被注册",
							maxlength : "请输入正确的邮箱地址"
						},
						password : {
							required : "请填写密码",
							minlength : "密码长度为6～20位",
							maxlength : "密码长度为6～20位"
						},
						checkPwd:{
							required : "请填写确认密码",
							equalTo: "两次密码输入不符"
						},
						cardNum: {
							minlength : "会员卡号长度有误",
							remote : "该会员卡不存在"
						}
					},
					submitHandler : function() {
						var provinceCode= $("#province").val();
						var cityCode=$("#city").val();
						var province=$("#province").find("option:selected").text();
						var city=$("#city").find("option:selected").text();
						$.post("registerOn.htm", {
								email : $("#email").val(),
								nickname : $("#nickname").val(),
								password : $("#password").val(),
								vCode: $("#vCode").val(),
								province:province,
								provinceCode: provinceCode,
								city:city,
								cityCode:cityCode,
								cardNum: $("#cardNum").val(),
								outUserReg:"${accessUser.uid}"
							}, function(data) {
								if (data != 'error') {
									$("#reg_btn").attr("disabled",true);
									window.location = "rSuccess.htm";
								} 
							});

						
						
					}
				});
	});
	//换一张
	function changeOne(){
		//alert("11");
		$("#vCode").val('');
		$("#yzm_src").attr("src","verifyCode.htm?time="+(new Date()).getTime());
	}
	function  registerByPhone(){
		$("#registerType").load("rPhone.htm").show();
	}
</script>
<!--[if ie 6]><script src="../js/common/iepng.js" type="text/javascript"></script><![endif]-->
<!--[if ie 6]><link href="../../css/jrIE6.css" type="text/css" rel="stylesheet"><![endif]-->
</head>

<body>
	 <!-- head -->
	<%@include file="v1/common/header.jsp" %>
	<!-- header-->

	<div class="wrap">
	<!-- Email register-->
    	<div class="r_reg_box" id="registerType">
        	<div class="head"></div>
            <div class="reg_content">
            	<div class="title">
                	<span class="fr">已经有爽客网账号？<a href="/login.htm" class="clrgre">直接登录</a></span>
                </div>
                <div class="pd_20">
                	<div class="tip"><img src="../../images/smallpic/zc-bz.jpg" /></div>
                    <form id="registerForm"  method="post">
                        <ul class="r_reg_info">
                            <li>
                                <label class="form_l"><i class="alarm">*</i>您的Email地址：</label>
                                <input type="text" name="email" id="email"/>
                                <!-- <a href="javascript:void(0);" class="else_reg" onclick="registerByPhone();">使用手机号注册>></a> -->
                                <span class="info_tip">请填写您的常用Email地址，做为爽客网的登录账号</span>
                            </li>
                            <li>
                                <label class="form_l"><i class="alarm">*</i>用户名：</label>
                                <input type="text" name="nickname" id="nickname" value="${accessUser.name }"/>
                                <span class="info_tip">4-16个字符，中英文均可，推荐使用中文名</span>
                            </li>
                            <li>
                                <label class="form_l"><i class="alarm">*</i>设置密码：</label>
                                <input type="password" id="password" name="password"/>
                                <span class="info_tip" >6-16个字符，推荐使用英文字母加数字的组合密码</span>
                            </li>
                            <li>
                                <label class="form_l"><i class="alarm">*</i>确认密码：</label>
                                <input type="password" id="checkPwd" name="checkPwd"/>
                                <span class="info_tip">请再次输入密码</span>
                            </li>
                            <li>
                                <label class="form_l">会员卡号：</label>
                                <input type="text" id="cardNum" name="cardNum"/>
                            </li>
                            <li>
                                <label class="form_l"><i class="alarm">*</i>验证码：</label>
                                <input type="text" class="reg_yzm" id="vCode" /><img src="" id="yzm_src" align="top" class="ml5"/><a href="javascript:void(0);"onclick="changeOne();" class="yzm_link">换一张</a>
                                <span class="info_tip">请输入验证码</span>
                            </li>
                            <li>
                            	<label class="form_l">所在地：</label>
                                <select id="province" name="province" style="width: 65px">
                                	<option selected="selected" >请选择</option>
		      					 </select>
                                 <select id="city" name="city" style="width: 65px">
                                 	<option selected="selected">请选择</option>
                                 </select>
                                <div class="other_info">
                                	<input type="checkbox" checked="checked" class="cb_accept" disabled="disabled"/><span>我已阅读并接受《<a href="#" class="clrblue">爽客网旅游网会员服务条款</a>》</span>
                                    
                                </div>
                            </li>
                        </ul>
                         <input type="image" class="reg_btn" id="reg_btn" value=" "/>
                    </form>
                </div>
            </div>
            <div class="foot"></div>
        </div>
        <!-- Email register--end-->
     
    </div>
    <!--footer-->
    <%@include file="v1/common/footer.jsp" %>
    <!--footer--end-->
</body>
</html>
